import { useState, useEffect } from 'react'

import { useRoutes, useLocation, useNavigate } from 'react-router-dom'
import routes from './router'


function ToPage1() {
  const navigateTo = useNavigate();
  useEffect(() => {
    // 加载完执行
    navigateTo('/page1');
  }, [])
  return <div></div>
}

function ToLogin() {
  const navigateTo = useNavigate();
  useEffect(() => {
    // 加载完执行
    navigateTo('/login');
  }, [])
  return <div></div>
}

function BeforeRouter() {
  const outlet = useRoutes(routes)

  let token = localStorage.getItem('token');
  const location = useLocation();
  if (location.pathname == '/login' && token) {
    
    return <ToPage1 />
  } 
  if (location.pathname !== '/login' && location.pathname !== '/register' && !token) {
    return <ToLogin />
  } 
  
  return outlet;
}


function App() {
  
  return (
    <div className="App">

      {/* <Link to="/home">Home</Link>
      <Link to="/about">About</Link> */}
      {/* 占位符 */}
      {/* <Outlet></Outlet> */}
      <BeforeRouter></BeforeRouter>
    </div>
  )
}

export default App
